import { Component, OnInit, ViewChild, EventEmitter, Output, Input } from '@angular/core'
import { MatDrawer } from '@angular/material'

@Component({
  selector: 'app-drawer',
  templateUrl: './app-drawer.component.html',
  styleUrls: ['./app-drawer.component.less']
})
export class AppDrawerComponent implements OnInit {

  @ViewChild('drawer')
  drawer: MatDrawer
  @Output()
  toggleDrawer = new EventEmitter<boolean>()

  @Input()
  drawerPosition: string

  constructor() { }

  ngOnInit(): void { }

  onToggleDrawer(state: boolean): void {
    if (state !== undefined) {
      if (state === true) this.drawer.open()
      else this.drawer.close()
    } else {
      this.drawer.toggle()
    }
  }

  /**
   * 抛出事件
   * @param state 开合状态
   */
  onOpenedChange(state: boolean) {
    this.toggleDrawer.emit(state)
  }

  getDrawerPosition(): string {
    switch (this.drawerPosition) {
      case 'left': return 'start'
      case 'right': return 'end'
      default: return 'end'
    }
  }

}
